// 组合式api函数
// 倒计时的核心思路: 通过定时器每秒钟让数据--
// 1. 如何运作定时器
// 2. 搞明白要给谁--
// vueUse -> useIntervalFn 封装了原生js的定时器 让我们控制定时器更加的方便简单

// 格式化时间 dayjs
import { ref, computed } from 'vue'
import { useIntervalFn } from '@vueuse/core'
import dayjs from 'dayjs'
export function useCountDown () {
  // 1. 我们只需要把想要每隔1s钟想要做的事儿放到回调中就可以
  // 2. 如果想要开始进行倒计时回调函数的执行 需要手动调用resume方法 一旦这个方法被执行 回调函数开始每隔1s执行一次
  // 3. 如果在运行的过程中想要停止定时器 我们可以执行pause方法 一旦这个方法被执行 回调会立刻停止执行
  const { pause, resume } = useIntervalFn(() => {
    // 自己的核心逻辑
    // 做一层判断 最少减到0就停止
    console.log('定时回调在执行中')
    if (time.value === 0) {
      return pause()
    }
    time.value--
  }, 1000)
  // 1. 倒计时数据
  const time = ref(0)
  const formatTime = computed(() => {
    return dayjs.unix(time.value).format('mm分ss秒')
  })
  // 2. 开启倒计时的方法
  const start = (currentTime) => {
    // 在正式开始倒计时之前 先做一步初始值的赋值
    time.value = currentTime
    resume()
  }
  // 3. 停止倒计时的方法
  const stop = () => {
    pause()
  }
  return {
    time,
    start,
    stop,
    formatTime
  }
}
